<template>
    <!-- 门店 -->
    <el-dialog title="选择门店" :visible="show" width="900px" :before-close="selectCar" append-to-body>
        <el-form ref="carParam" :model="queryParams" label-width="100px">
            <el-row>
                <el-col :span="12">
                    <el-form-item label="门店名称" prop="storeName">
                        <el-input v-model="queryParams.storeName" placeholder="请输入门店名称" clearable size="small" @keyup.enter.native="handleQuery" />
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item>
                        <el-button type="primary" icon="el-icon-search" size="mini" @click="carRhandleQuery">搜索</el-button>
                        <el-button icon="el-icon-refresh" size="mini" @click="carResetQuery">重置</el-button>
                    </el-form-item>
                </el-col>
            </el-row>
        </el-form>
        <el-table v-loading="loading" :data="storeList" height="500px">
            <el-table-column label="门店名称" align="center" prop="storeName" width="180" :show-overflow-tooltip="true" />
            <el-table-column label="门店分类" align="center" prop="storeClass" :show-overflow-tooltip="true">
                <template slot-scope="scope">
                    <dict-tag :options="dict.type.store_class" :value="scope.row.storeClass" />
                </template>
            </el-table-column>
            <el-table-column label="门店类型" align="center" prop="storeType" :show-overflow-tooltip="true">
                <template slot-scope="scope">
                    <dict-tag :options="dict.type.store_type" :value="scope.row.storeType" />
                </template>
            </el-table-column>
            <el-table-column label="服务模式" align="center" prop="serviceMode" :show-overflow-tooltip="true">
                <template slot-scope="scope">
                    <dict-tag :options="dict.type.service_mode" :value="scope.row.serviceMode" />
                </template>
            </el-table-column>
            <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
                <template slot-scope="scope">
                    <el-button size="mini" type="text" @click="selectCar(scope.row)">选择</el-button>
                </template>
            </el-table-column>
        </el-table>
        <pagination :total="totalcarBasic" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="carNoClick" />

    </el-dialog>
</template>

<script>
import {
  allStoreNoScope
} from "@/api/store/store";

export default {
    dicts: ['store_type', 'sys_available', 'store_class', 'service_mode'],
    props: {
        show: {
            type: Boolean,
            default: false
        },
    },
    data() {
        return {
            loading: true,
            storeList: [],
            totalcarBasic: 0,
            queryParams: {
                pageNum: 1,
                pageSize: 10,
                storeName: null,
                isAvailable: 1,
            }
        }
    },
    mounted() {
        this.carNoClick()
    },

    methods: {
        carNoClick() {
            this.loading = true;
          allStoreNoScope(this.queryParams).then(response => {
                this.storeList = response.rows;
                this.totalcarBasic = response.total;
                this.loading = false;
            });
        },
        carRhandleQuery() {
            this.queryParams.pageNum = 1;
            this.carNoClick(this.queryParams);
        },
        carResetQuery() {
            this.resetForm("carParam");
            this.queryParams.isAvailable = 1
            this.carRhandleQuery();
        },
        selectCar(data) {
            this.$emit('success', data);
        }

    },
}
</script>

<style>
</style>
